.px2rem(@name, @px) {
    @{name}: @px / 25 * 1rem;
}

html,
body {
    background: #eeeeee;
}

header {
    .px2rem(height, 87);
    background: #000;
    position: relative;

    .i1 {
        position: absolute;
        top: 0.7rem;
        left: 1rem;
    }

    .p1 {
        color: #fff;
        text-align: center;
        .px2rem(line-height, 87);
    }
}

.box {
    .px2rem(height, 278);
    background: #fff;

    .dl1 {
        dt {
            float: left;

            .i2 {
                .px2rem(width, 140);
                .px2rem(height, 140);
                margin-top: 1rem;
                margin-left: 1rem;

            }
        }

        dd {
            width: 15rem;
            .px2rem(height, 197);
            margin-left: 8rem;
            line-height: 1.5rem;

            .p2 {
                padding-top: 1.2rem;

            }

            .p3 {
                color: #e0c53c;

                .i3 {
                    .px2rem(width, 24);
                    .px2rem(height, 36);
                }
            }

            .p4 {
                color: #878787;
            }
        }
    }
}

.box1 {
    .px2rem(height, 157);
    background: #fff;
    margin-top: 1rem;

    .i4 {
        .px2rem(width, 37);
        .px2rem(height, 37);
        padding: 0 0.5rem;
    }

    .p5 {
        line-height: 4rem;
        margin-left: 0.5rem;
    }

    .p6 {
        width: 18rem;
        height: 2.2rem;
        color: #878787;
        margin-left: 3.5rem;
        border-bottom: 1px solid #eaeaea;
    }
}

.box2 {
    .px2rem(height, 157);
    background: #fff;

    .i4 {
        .px2rem(width, 37);
        .px2rem(height, 37);
        padding: 0 0.5rem;
    }

    .p5 {
        line-height: 4rem;
        margin-left: 0.5rem;
    }

    .p6 {
        width: 18rem;
        height: 2.2rem;
        color: #878787;
        margin-left: 3.5rem;
        border-bottom: 1px solid #eaeaea;
    }
}

.box3 {
    height: 9.28rem;
    background: #fff;

    .i4 {
        .px2rem(width, 37);
        .px2rem(height, 37);
        padding: 0 0.5rem;
    }

    .p5 {
        line-height: 4rem;
        margin-left: 0.5rem;

        span {
            float: right;
            margin-right: 2rem;
            color: #e53c3c;
        }
    }

    .p6 {

        color: #878787;
        line-height: 1.5rem;
        margin-left: 2.5rem;
    }
}

.box4 {
    .px2rem(height, 390);
    background: #fff;
    margin-top: 1rem;

    ul {
        li {
            float: left;
            font-weight: bolder;
        }

        .li1 {
            .px2rem(width, 200);
            height: 0.2rem;
            background: #eaeaea;
            float: left;
            margin-left: 0.6rem;
            margin-top: 2rem;
        }

        .li2 {
            .px2rem(width, 200);
            height: 0.2rem;
            background: #eaeaea;
            float: left;
            margin-left: 1.5rem;
            margin-top: 2rem;
        }

        .li3 {
            margin-top: 1.6rem;
            margin-left: 1.1rem;
        }
    }

    .p7 {
        clear: both;
        color: #999999;
        line-height: 2rem;
        font-size: 15px;
        margin-left: 1rem;
        margin-top: 2rem;
    }
}

footer {
    .px2rem(height, 96);
    background: #fff;
    margin-top: 1rem;

    .dl2 {
        width: 7.72rem;

        .px2rem(height, 95);
        float: left;
        dt {
            img {
                .px2rem(width, 31);
                .px2rem(height, 40);
                margin-left: 1rem;
                margin: 1rem;
                float: left;
            }
        }
        dd{
            padding-top: 1.2rem;
            margin-left: 0.5rem;
            font-size: 12px;
        }
    }
}